<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="/struts-tags" prefix="s"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
     <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>修改个人信息</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	    <!-- 新 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/resources/plugins/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/frontcss/menu.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/frontcss/change.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/resources/plugins/bootstrap/css/fileinput.min.css">

  </head>
  
  <body>
    <div id="menu" class="topmenu">
    	<%@ include file="../menu.jsp" %>
    </div>
    <div class="myblock" style="padding-top:100px;"></div>
    <div class="container" style="margin-top:-10px;">
        <h1 style="color:orange;">BookShare</h1>
        <div class="main col-sm-12 col-md-12" style="border:1px orange solid;">
            <div class="menu col-sm-2 col-md-2 hidden-xs" style="margin-top:20px">
                <img src="${pageContext.request.contextPath}/resources/images/indeximages/01.jpg" alt="" width="150px" height="90px">
                <br></br>
                <ul class="list-group" style="margin-left: 10px;width:120px">
                    <li class="list-group-item"><a href="">个人基本信息</a></li>
                    <li class="list-group-item"><a href="">重要信息更改</a></li>
                    <li class="list-group-item"><a href="">接洽地址</a></li>
                </ul>
            </div>
            <div class="content col-sm-10 col-md-10" style="border:1px #e8e8e8 solid;margin-top:20px;">
                <h2 style="color:orange;margin-left:15px;">个人信息</h2>
                
                <form class="form-horizontal" role="form" onsubmit="return checkForm();">
                    <div class="form-group">
                       <label for="nickname" class="col-sm-2 control-label">昵称</label>
                       <div class="col-sm-10">
                          <input type="text" class="form-control tooltip-show" id="nickname" 
                             placeholder="newname" tabindex="1" autofocus title="输入一个有个性的昵称吧" onblur="checkNickname();" onclick="tipNickname();">
                             <span id="s1" class="tooltip-show tipwarning" data-placement="top" data-toggle="tooltip" title="昵称不能为空"></span>
                       </div>
                    </div>
                    <div class="form-group">
                       <label for="email" class="col-sm-2 control-label">邮箱</label>
                       <div class="col-sm-10">
                          <input type="text" class="form-control tooltip-show" id="email" 
                             placeholder="newemail" title="输入有效的Email地址" tabindex="2" onblur="checkEmail();" onfocus="tipEmail();">
                             <span id="s2" class="tooltip-show tipwarning" data-placement="top" data-toggle="tooltip" title="邮箱不能为空"></span><span id="s3" class="tooltip-show tipwarning" data-placement="top" data-toggle="tooltip" title="邮箱格式错误"></span><span id="s4" class="tooltip-show tipwarning" data-placement="top" data-toggle="tooltip" title="格式正确"></span>
                       </div>
                    </div>
                    <div class="form-group">
                       <label for="phone" class="col-sm-2 control-label">电话</label>
                       <div class="col-sm-10">
                          <input type="text" class="form-control tooltip-show" id="phone" 
                             placeholder="电话" title="新手机？" tabindex="3" onblur="checkPhone();" onfocus="tipPhone();">
                             <span id="s5" class="tooltip-show tipwarning" data-placement="top" data-toggle="tooltip" title="电话不能为空"></span>
                       </div>
                    </div>
                    <div class="form-group">
                       <label for="resume" class="col-sm-2 control-label">个人简介</label>
                       <div class="col-sm-10">
                          <textarea class="form-control tooltip-show" id="user_resume" placeholder="个人简介" title="您的个人简介" tabindex="4" onblur="checkResume();" onfocus="tipResume();"></textarea>
                          <span id="s6" class="tooltip-show tipwarning" data-placement="top" data-toggle="tooltip" title="个人简介不能为空"></span>
                       </div>
                    </div>
                
                    <div class="from-group">
                        <lable class=" col-sm-offset-1 col-sm-2 control-lable">图片上传</lable>
                        <p class="help-bolck">支持jpg,png格式，大小不超过2M</p>
                        <div class="col-sm-offset-2 col-sm-8" >
                            <input id="file" type="file" name="myfile" data-show-caption="true">
                        </div>
                    </div>  
                    <br></br><br></br>
                    <div class="form-group">
                       <div class="col-sm-offset-2 col-sm-10">
                          <button type="submit" class="btn btn-info">保存</button>
                       </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
    <script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>

    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="http://cdn.bootcss.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
    <script src="${pageContext.request.contextPath}/resources/plugins/bootstrap/js/fileinput.min.js"></script>
    <script src="${pageContext.request.contextPath}/resources/plugins/bootstrap/js/zh.js"></script>
    <script src="${pageContext.request.contextPath}/js/frontjs/user/change.js"></script>
    <script>
        function initFileInput(ctrlName,uploadUrl) {      
                var control = $('#' + ctrlName);   
                control.fileinput({  
                    language: 'zh', //设置语言  
                    uploadUrl: uploadUrl,  //上传地址  
                    showUpload: true, //是否显示上传按钮  
                    showRemove:true,  
                    dropZoneEnabled: false,  
                    showCaption: true,//是否显示标题  
                    allowedPreviewTypes: ['image'],  
                        allowedFileTypes: ['image'],  
                        allowedFileExtensions:  ['jpg', 'png'],  
                        maxFileSize : 2000,  
                    maxFileCount: 3,  
                    //initialPreview: [   
                            //预览图片的设置  
                      //      "<img src='http://127.0.0.1:8080/NewsManageSys/plugin/umeditor1_2_2/jsp/upload/20161030/55061                       477813913474.jpg' class='file-preview-image' alt='肖像图片' title='肖像图片'>",  
                    //],  

                }).on("filebatchselected", function(event, files) {  
                    $(this).fileinput("upload");  
                    })  
                    .on("fileuploaded", function(event, data) {  
                        /*$("#path").attr("value",data.response); */ 
                });  
            }  

            $(function () {  
                var path="";  
                initFileInput("file",path);  

            });  
    </script>
  </body>
</html>
